<!DOCTYPE html>
<style>
.animated {
  animation: test 10ms;
  animation-delay: -10ms;
}
@keyframes test {
  0% {}
}
</style>
<div id="block"></div>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script>
async_test(t => {
  window.addEventListener("load", t.step_func(() => {
    // This test covers a specific regression where an on-demand timing update
    // that was triggered after an animation received a start time could cause
    // CSS Animation and Transition events to not be fired on the subseuquent
    // animation-frame timing update.
    block.classList.add('animated');
    block.addEventListener('animationstart', t.step_func_done(() => {}));
    requestAnimationFrame(t.step_func(() => {
      t.step_timeout(() => {
        getComputedStyle(block).left;
      });
    }));
  }));
}, "Should fire animation events after on-demand timing update");
</script>
